<template>
  <div @click="handleChange">
    <Input v-model:value="selectValues" style="width: 80px" readonly class="cursor" />
    <AppRateModal @register="registerRateModal" />
  </div>
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import { Input } from 'ant-design-vue';
  import AppRateModal from './AppRateModal.vue';
  import { useModal } from '/@/components/Modal';
  import { useFinanceStore } from '/@/store/modules/finance';

  const selectValues = ref('实时汇率');

  const [registerRateModal, { openModal: openRateModal }] = useModal();
  const financeStore = useFinanceStore();

  const handleChange = async () => {
    openRateModal(true, financeStore.getRateObject);
  };
</script>
